<template>
    <div>
      <div style="display: flex; justify-content: flex-start">
        <el-input
          placeholder="档案号/姓名"
          v-model="page.searchObj.query"
          autofocus
          style="width: 230px; margin-right: 30px"
          clearable
          ><i slot="prefix" class="el-input__icon el-icon-search"></i
        ></el-input>
        <el-button type="primary" icon="el-icon-search" @click="query"
          >搜索</el-button
        >
      </div>
      <el-button
        type="primary"
        style="display: flex; justify-content: flex-start; margin: 10px 0"
        @click="dialogTableVisible = true"
        >新增</el-button
      >
      <el-table
        :data="tableData"
        style="width: 100%"
        height="65vh"
        highlight-current-row
      >
        <el-table-column type="selection" width="55"> </el-table-column>
        <el-table-column prop="id" label="档案号"> </el-table-column>
        <el-table-column prop="name" label="姓名"> </el-table-column>
        <el-table-column prop="date" label="心理评测日期"> </el-table-column>
        <el-table-column prop="soma" label="躯体化">
        </el-table-column>
        <el-table-column prop="obsession" label="强迫症化">
        </el-table-column>
        <el-table-column label="操作">
          <template slot-scope="">
            <span>
              <el-button type="primary" icon="el-icon-edit" circle></el-button>
            </span>
          </template>
        </el-table-column>
      </el-table>
      <div class="block">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="page.pageNum"
          :page-sizes="[5, 10]"
          :page-size="page.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
        >
        </el-pagination>
      </div>
      <!-- 新增 -->
      <el-dialog width="80%" title="新增问卷" :visible.sync="dialogTableVisible">
        <el-form
          :inline="true"
          :model="formInline"
          class="demo-form-inline"
          style="display: flex; justify-content: flex-start; margin-left: 20px"
        >
          <el-form-item label="身份证">
            <el-input
              v-model="formInline.card"
              placeholder="请输入身份证"
              @input="clear"
              clearable
            ></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="onSubmit">查询</el-button>
          </el-form-item>
          <el-form-item label="姓名">
            <el-input v-model="obj.name" disabled></el-input>
          </el-form-item>
          <el-form-item label="年龄" style="margin-left: 20px">
            <el-input v-model="obj.age" disabled></el-input>
          </el-form-item>
          <el-form-item label="性别">
            <el-input v-model="obj.sex" disabled></el-input>
            <template> </template>
          </el-form-item>
        </el-form>
        <el-tabs type="border-card">
          
          <el-tab-pane :label="type.name" v-for="(type) in map" :key="type.id">
            <el-row :gutter="20" v-for="(tableData,index) in type.questionBanks" :key="tableData.index">
              <div v-if="tableData.type_id==3" style="width:100%">
                <el-col :span="6">{{ tableData.question }}</el-col>
                <el-col :span="3">
                  <el-radio v-model="radio1[index]" label="5">没有（根本不）</el-radio>
                </el-col>
                <el-col :span="3">
                  <el-radio v-model="radio1[index]"  label="4">很少（有一点）</el-radio>
                </el-col>
                <el-col :span="3">
                  <el-radio v-model="radio1[index]"  label="3">有时（有些）</el-radio>
                </el-col>
                <el-col :span="3">
                  <el-radio v-model="radio1[index]" label="2">经常（相当）</el-radio>
                </el-col>
                <el-col :span="3">
                  <el-radio v-model="radio1[index]" label="1">总是（非常）</el-radio>
                </el-col>
              
              
              </div>


              <div v-if="tableData.type_id==4" style="width:100%">
                <el-col :span="6">{{ tableData.question }}</el-col>
                <el-col :span="3">
                  <el-radio v-model="radio2[index]" label="5">没有（根本不）</el-radio>
                </el-col>
                <el-col :span="3">
                  <el-radio v-model="radio2[index]"  label="4">很少（有一点）</el-radio>
                </el-col>
                <el-col :span="3">
                  <el-radio v-model="radio2[index]"  label="3">有时（有些）</el-radio>
                </el-col>
                <el-col :span="3">
                  <el-radio v-model="radio2[index]" label="2">经常（相当）</el-radio>
                </el-col>
                <el-col :span="3">
                  <el-radio v-model="radio2[index]" label="1">总是（非常）</el-radio>
                </el-col>
              
              
              </div>
                
            </el-row>
          </el-tab-pane>
  
  
  
  
  
        </el-tabs>
        <div slot="footer" class="dialog-footer">
          <el-button @click="dialogTableVisible = false">取 消</el-button>
          <el-button type="primary" @click="save">提交</el-button>
        </div>
      </el-dialog>
    </div>
  </template>
    
    <script>
  export default {
    data() {
      return {
        map:[],
        radio1:[],
        radio2:[],
        formInline: {
          //查询预约
          card: "",
          nmae: "",
        },
        dialogTableVisible: false,
        page: {
          //分页查询条件
          pageNum: 1, //当前页
          pageSize: 5, //页面数量
          searchObj: {
            //条件对象
            query: "", //档案号/姓名
          },
        },
        tableData: [], //表格数据
        total: 0, //总数量
        obj: {
          rid:0,
          id: "",
          name: "",
          age: "",
          sex: "",
          date: "",
          soma: "",
          obsession: "",
        },
      };
    },
    created() {
      this.queryPsychologyAll();
      this.queryQuestionBankTypeAll();
    },
    methods: {
      clear() {
        this.obj.rid =0;
        this.obj.id = "";
        this.obj.name = "";
        this.obj.age = "";
        this.obj.sex = "";
      },
      queryQuestionBankTypeAll(){//一对多
        this.axios.post("/api/hj/queryQuestionBankTypeAll")
        .then(result=>{
          this.map=result.data;
        })
      },
      onSubmit() {
        this.axios
          .get("/api/hj/queryBookingState", {
            params: {
              card: this.formInline.card,
            },
          })
          .then((result) => {
            if (result.data != "") {
              this.obj.rid=result.data.rid;
              this.obj.id = result.data.file_number;
              this.obj.name = result.data.name;
              this.obj.age = result.data.age;
              this.obj.sex = result.data.sex == 0 ? "女" : "男";
            } else {
              this.obj.rid=0;
              this.obj.id = "";
              this.obj.name = "";
              this.obj.age = "";
              this.obj.sex = "";
            }
          });
      },
      handleSizeChange(val) {
        this.page.pageSize = val;
        this.queryPsychologyAll();
      },
      handleCurrentChange(val) {
        this.page.pageNum = val;
        this.queryPsychologyAll();
      },
      //条件查询
      query() {
        this.queryPsychologyAll();
      },
      //   查询所有心理评测
      queryPsychologyAll() {
        this.axios.post("/api/hj/queryPsychologyAll", this.page).then((result) => {
          this.total = result.data.total;
          this.tableData = result.data.list;
        });
      },
      //新增
      save(){
        let itemCount1=0;//条目数
        let itemCount2=0;//条目数
        this.map.forEach(t=>{
          if(t.id==3){
            itemCount1=t.questionBanks.length;
          }else if(t.id==4){
            itemCount2=t.questionBanks.length;
          }
        })
        let f1 = false;
        if(itemCount1==this.radio1.length){
          // 躯体化
        //转化分数 =( 原始分- 条目数)÷( 条目数× 4)×100
        let score1=0;
        let count1=0;//原始分
        this.radio1.forEach(r=>{
          count1=count1+parseInt(r);
        })
        score1=(count1-itemCount1)/(itemCount1*4)*100;
        if(score1<30 || score1<40){
          this.obj.soma="是";
        }else{
          this.obj.soma="否";
        }
          f1=true;
        }
        let f2 = false;
        if(itemCount2==this.radio2.length){
          //强迫症化
        let score2=0;
        let count2=0;//原始分
        this.radio2.forEach(r=>{
          count2=count2+parseInt(r);
        })
        score2=(count2-itemCount2)/(itemCount2*4)*100;
        if(score2<30 || score2<40){
          this.obj.obsession="是";
        }else{
          this.obj.obsession="否";
        }
          f2=true;
        }
        if(this.obj.id!=''){
          if(f1 && f2){
            let date = new Date();
          this.obj.date=date.getFullYear()+'-'+(date.getMonth()+1)+'-'+date.getDate()
          if(this.obj.sex=='男'){
              this.obj.sex=1;
          }else{
            this.obj.sex=0;
          }
          console.log(this.obj);
          this.axios.post("/api/hj/savePsychology",this.obj)
          .then(result=>{
            if(result.data>0){
              this.queryPsychologyAll();
              this.$message({
            showClose: true,
            message: '成功操作一条数据',
            type: 'success'
          });
            this.dialogTableVisible=false;
            }
          })
        }else{
          this.$message({
            showClose: true,
            message: '请填写完问卷'
          });
        }
        }else{
          this.$message({
            showClose: true,
            message: '请先查询问卷身份信息'
          });
        }   
      },
    },
  };
  </script>
    
    <style>
  </style>